<template>
  <div>
    <a-modal title="岗位变动" :width="width" :visible="visible" @ok="ok" @cancel="cancel">
      <template #footer>
        <a-button key="back" @click="cancel">关闭</a-button>
        <a-button key="submit" type="primary" @click="ok">保存</a-button>
        <a-button key="submit1" type="primary" @click="fnSubmitApply">提交申请</a-button>
      </template>
      <!-- <a-table :dataSource="rows" :columns="columns" :pagination="false" bordered> </a-table> -->
      <a-row :gutter="16">
        <a-col :span="24">
          <a-form-item label="变动类型">
            <a-radio-group v-model="types">
              <a-radio :value="1">合同</a-radio>
              <a-radio :value="2">劳务</a-radio>
            </a-radio-group>
          </a-form-item>
        </a-col>
      </a-row>
      <a-form-model ref="form" :form="form" style="margin-top: 16px">
        <a-row>
          <!--合同-->
          <div v-if="types == 1" class="table-box">
            <table>
              <tbody>
                <tr>
                  <td>姓名</td>
                  <td>{{ form.name }}</td>
                  <td>单位</td>
                  <td colspan="2">{{ form.dwname }}</td>
                  <!-- <td>入职时间</td>
                <td></td> -->
                </tr>
                <tr>
                  <td rowspan="4">原 岗 位</td>
                </tr>
                <tr>
                  <td>部门</td>
                  <td><a-input v-model="form.ksname" placeholder="主要工作内容"></a-input></td>
                  <td>职务</td>
                  <td colspan="2">{{ form.gwname }}</td>
                </tr>
                <tr>
                  <td>主要工作内容</td>
                  <td colspan="4">
                    <a-input v-model="form.oldmain" placeholder="主要工作内容"></a-input>
                  </td>
                </tr>
                <tr>
                  <td>薪酬待遇</td>
                  <td colspan="4"></td>
                </tr>
                <tr>
                  <td rowspan="8">变 更 后 岗 位</td>
                </tr>
                <tr>
                  <td>部门</td>
                  <td><a-input v-model="form.newbm" placeholder="部门"></a-input></td>
                  <td>岗位</td>
                  <td colspan="2"><a-input v-model="form.newgw" placeholder="岗位"></a-input></td>
                </tr>
                <tr>
                  <td>主要工作内容</td>
                  <td colspan="4"><a-input v-model="form.newmain" placeholder="主要工作内容"></a-input></td>
                </tr>
                <tr>
                  <td rowspan="5">薪酬待遇</td>
                </tr>
                <tr>
                  <th>基本工资</th>
                  <th>交通补贴</th>
                  <th>通讯费</th>
                </tr>
                <tr>
                  <td>
                    <a-input
                      v-model="form.newjbgz"
                      placeholder="基本工资"
                      @blur="changValue('newjbgz')"
                      type="number"
                    ></a-input>
                  </td>
                  <td>
                    <a-input
                      v-model="form.jiaotongbutie"
                      placeholder="交通补贴"
                      type="number"
                      @blur="changValue('jiaotongbutie')"
                    ></a-input>
                  </td>
                  <td>
                    <a-input
                      v-model="form.tongxunfei"
                      placeholder="通讯费"
                      type="number"
                      @blur="changValue('tongxunfei')"
                    ></a-input>
                  </td>
                </tr>
                <tr>
                  <th>生活补贴</th>
                  <th>房补</th>
                  <th>工龄津贴</th>
                </tr>
                <tr>
                  <td>
                    <a-input
                      v-model="form.shbt"
                      placeholder="生活补贴"
                      type="number"
                      @blur="changValue('shbt')"
                    ></a-input>
                  </td>
                  <td>
                    <a-input
                      v-model="form.fangbu"
                      placeholder="房补"
                      type="number"
                      @blur="changValue('fangbu')"
                    ></a-input>
                  </td>
                  <td>
                    <a-input
                      v-model="form.gljt"
                      placeholder="工龄津贴"
                      type="number"
                      @blur="changValue('gljt')"
                    ></a-input>
                  </td>
                </tr>
                <tr>
                  <td>变 更 原 因</td>
                  <td colspan="5"><a-input v-model="form.bgyuanyin" placeholder="变 更 原 因"></a-input></td>
                </tr>
                <tr>
                  <td>生效日期</td>
                  <td colspan="5"><a-date-picker v-model="form.sxdt" dateFormat="YYYY-MM-DD" /></td>
                </tr>
              </tbody>
            </table>
          </div>
          <!--劳务-->
          <div v-if="types == 2" class="table-box">
            <table>
              <tbody>
                <tr>
                  <td>姓名</td>
                  <td>{{ form.name }}</td>
                  <td>单位</td>
                  <td colspan="2">{{ form.dwname }}</td>
                  <!-- <td>入职时间</td>
                <td></td> -->
                </tr>
                <tr>
                  <td rowspan="4">原 岗 位</td>
                </tr>
                <tr>
                  <td>部门</td>
                  <td><a-input v-model="form.ksname" placeholder="部门"></a-input></td>
                  <td>职务</td>
                  <td colspan="2">{{ form.gwname }}</td>
                </tr>
                <tr>
                  <td>主要工作内容</td>
                  <td colspan="4">
                    <a-input v-model="form.oldmain" placeholder="主要工作内容"></a-input>
                  </td>
                </tr>
                <tr>
                  <td>薪酬待遇</td>
                  <td colspan="4"></td>
                </tr>
                <tr>
                  <td rowspan="8">变 更 后 岗 位</td>
                </tr>
                <tr>
                  <td>部门</td>
                  <td><a-input v-model="form.newbm" placeholder="部门"></a-input></td>
                  <td>岗位</td>
                  <td colspan="2"><a-input v-model="form.newgw" placeholder="岗位"></a-input></td>
                </tr>
                <tr>
                  <td>主要工作内容</td>
                  <td colspan="4"><a-input v-model="form.newmain" placeholder="主要工作内容"></a-input></td>
                </tr>
                <tr>
                  <td rowspan="5">薪酬待遇</td>
                </tr>
                <tr>
                  <th>基本工资</th>
                  <th>岗位工资</th>
                  <th colspan="2">浮动工资</th>
                </tr>
                <tr>
                  <td>
                    <a-input
                      v-model="form.newjbgz"
                      placeholder="基本工资"
                      type="number"
                      @blur="changValue('newjbgz')"
                    ></a-input>
                  </td>
                  <td>
                    <a-input
                      v-model="form.gwgz"
                      placeholder="岗位工资"
                      type="number"
                      @blur="changValue('gwgz')"
                    ></a-input>
                  </td>
                  <td colspan="2">
                    <a-input
                      v-model="form.fdgz"
                      placeholder="浮动工资"
                      type="number"
                      @blur="changValue('fdgz')"
                    ></a-input>
                  </td>
                </tr>
                <tr>
                  <th>养老保险</th>
                  <th>失业保险</th>
                  <th colspan="2">医疗保险</th>
                </tr>
                <tr>
                  <td>
                    <a-radio-group v-model="form.yldaijiao">
                      <a-radio :value="1">代缴</a-radio>
                      <a-radio :value="2">不代缴</a-radio>
                    </a-radio-group>
                    <a-input
                      v-if="form.yldaijiao == 1"
                      style="width: 90px"
                      v-model="form.yldaijiaoje"
                      placeholder="代缴金额"
                      type="number"
                      @blur="changValue('yldaijiaoje')"
                    ></a-input>
                  </td>
                  <td>
                    <a-radio-group v-model="form.shiyedaijiao">
                      <a-radio :value="1">代缴</a-radio>
                      <a-radio :value="2">不代缴</a-radio>
                    </a-radio-group>
                    <a-input
                      v-if="form.shiyedaijiao == 1"
                      style="width: 90px"
                      v-model="form.shiyedaijiaoje"
                      placeholder="代缴金额"
                      type="number"
                      @blur="changValue('shiyedaijiaoje')"
                    ></a-input>
                  </td>
                  <td colspan="2">
                    <a-radio-group v-model="form.yiliaodaijiao">
                      <a-radio :value="1">代缴</a-radio>
                      <a-radio :value="2">不代缴</a-radio>
                    </a-radio-group>
                    <a-input
                      v-if="form.yiliaodaijiao == 1"
                      style="width: 90px"
                      v-model="form.yiliaodaijiaoje"
                      placeholder="代缴金额"
                      type="number"
                      @blur="changValue('yiliaodaijiaoje')"
                    ></a-input>
                  </td>
                </tr>
                <tr>
                  <td>变 更 原 因</td>
                  <td colspan="5"><a-input v-model="form.bgyuanyin" placeholder="变 更 原 因"></a-input></td>
                </tr>
                <tr>
                  <td>生效日期</td>
                  <td colspan="5"><a-date-picker v-model="form.sxdt" dateFormat="YYYY-MM-DD" /></td>
                </tr>
              </tbody>
            </table>
          </div>
        </a-row>
      </a-form-model>
    </a-modal>
    <!--提交申请表单-->
    <a-modal title="提交审批" v-model="modalVisible" :mask-closable="false" :width="500" :footer="null">
      <div v-if="modalVisible">
        <a-form-item label="选择审批人" v-show="showAssign">
          <a-select style="width: 100%" v-model="formTwo.assignees" placeholder="请选择" :allowClear="true">
            <a-select-option v-for="(item, i) in assigneeList" :key="i" :value="item.username">{{
              item.realname
            }}</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="下一审批人" v-show="isGateway">
          <a-alert type="info" showIcon message="分支网关处不支持自定义选择下一审批人，将自动下发给所有可审批人。"
            >，将发送给下一节点所有人</a-alert
          >
        </a-form-item>
        <a-form-item label="优先级" prop="priority">
          <a-select v-model="formTwo.priority" placeholder="请选择" :allowClear="true" style="width: 100%">
            <a-select-option :value="0">普通</a-select-option>
            <a-select-option :value="1">重要</a-select-option>
            <a-select-option :value="2">紧急</a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="消息通知">
          <a-checkbox v-model="formTwo.sendMessage">站内消息通知</a-checkbox>
          <a-checkbox v-model="formTwo.sendSms" disabled>短信通知</a-checkbox>
          <a-checkbox v-model="formTwo.sendEmail" disabled>邮件通知</a-checkbox>
        </a-form-item>
        <div slot="footer">
          <a-button type="text" @click="cancelTijiao">取消</a-button>
          <div style="display: inline-block; width: 20px"></div>
          <a-button type="primary" :disabled="submitLoading" @click="applySubmit">提交</a-button>
        </div>
      </div>
    </a-modal>
  </div>
</template>

<script>
const columns = [
  { dataIndex: 'name', key: 'name', title: '姓名' },
  { dataIndex: 'borth', key: 'borth', title: '生日' },
  { dataIndex: 'sfzh', key: 'sfzh', title: '身份证' },
]
import JDate from '@/components/jeecg/JDate'
import { postAction } from '@/api/manage'
export default {
  props: {
    visible: false,
    rows: [],
    JDate,
  },
  created() {},
  watch: {
    rows: {
      handler(newVal) {
        this.form = newVal[0]
      },
      deep: true,
      immediate: true,
    },
  },
  data() {
    return {
      columns,
      form: {},
      width: 1400,
      visible: false,
      types: 1,
      formTwo: {
        priority: 0,
        assignees: [],
        sendMessage: true,
      },
      modalVisible: false,
      assigneeList: [],
      submitLoading: false,
      url: {
        getFirstNode: '/actProcessIns/getFirstNode',
        applyBusiness: '/actBusiness/apply',
      },
    }
  },
  methods: {
    applySubmit() {
      if (this.showAssign && this.formTwo.assignees.length < 1) {
        this.error = '请至少选择一个审批人'
        this.$message.error(this.error)
        return
      } else {
        this.error = ''
      }
      this.submitLoading = true
      var params = Object.assign({}, this.formTwo)
      // params.assignees = params.assignees.join(",")
      let that = this
      this.postFormAction(this.url.applyBusiness, params)
        .then((res) => {
          if (res.success) {
            this.$message.success('操作成功')
            // that.loadData();
            that.modalVisible = false
            that.cancel()
          } else {
            this.$message.error(res.message)
          }
        })
        .finally(() => (this.submitLoading = false))
    },
    changValue(e) {
      if (e == 'newjbgz') {
        this.form.newjbgz = Number(this.form.newjbgz).toFixed(2)
      } else if (e == 'jiaotongbutie') {
        this.form.jiaotongbutie = Number(this.form.jiaotongbutie).toFixed(2)
      } else if (e == 'tongxunfei') {
        this.form.tongxunfei = Number(this.form.tongxunfei).toFixed(2)
      } else if (e == 'shbt') {
        this.form.shbt = Number(this.form.shbt).toFixed(2)
      } else if (e == 'fangbu') {
        this.form.fangbu = Number(this.form.fangbu).toFixed(2)
      } else if (e == 'gljt') {
        this.form.gljt = Number(this.form.gljt).toFixed(2)
      } else if (e == 'newjbgz') {
        this.form.newjbgz = Number(this.form.newjbgz).toFixed(2)
      } else if (e == 'gwgz') {
        this.form.gwgz = Number(this.form.gwgz).toFixed(2)
      } else if (e == 'fdgz') {
        this.form.fdgz = Number(this.form.fdgz).toFixed(2)
      } else if (e == 'yldaijiaoje') {
        this.form.yldaijiaoje = Number(this.form.yldaijiaoje).toFixed(2)
      } else if (e == 'shiyedaijiaoje') {
        this.form.shiyedaijiaoje = Number(this.form.shiyedaijiaoje).toFixed(2)
      } else if (e == 'yiliaodaijiaoje') {
        this.form.yiliaodaijiaoje = Number(this.form.yiliaodaijiaoje).toFixed(2)
      }
      //
    },
    towNumber(val) {
      return val.toFixed(2)
    },
    valiintegerTwo(rule, value, callback) {
      let reg = /^[0-9]*(?:\.[0-9]{1,4})?$/
      // /^[0-9]*(?:\.[0-9]{1,2})?$/;（正数只能填写两位小数的判断）
      if (!reg.exec(value)) {
        callback(new Error('请输入大于0的两位小数'))
      } else if (!value) {
        callback(new Error('请输入内容'))
      } else {
        callback()
      }
    },
    //提交申请
    fnSubmitApply() {
      const ids = this.rows.map((item) => {
        return item.biandongid
      })

      var params = {
        type: 3,
        ids: ids.toString(),
      }
      postAction('/bj/bjIdcardfk/saveActBussinessDataBeforApprove', params).then((res) => {
        console.log('提审:' + JSON.stringify(res))
        if (res.success) {
          this.apply(res.result)
        } else {
          this.$message.error('失败')
        }
      })
    },
    apply(v) {
      if (!v.procDefId || v.procDefId == 'null') {
        this.$message.error('流程定义为空')
        return
      }
      this.formTwo.id = v.id
      this.formTwo.procDefId = v.procDefId
      this.formTwo.title = v.title
      // 加载审批人
      this.getAction(this.url.getFirstNode, { procDefId: v.procDefId }).then((res) => {
        if (res.success) {
          if (res.result.type == 3 || res.result.type == 4) {
            this.isGateway = true
            this.modalVisible = true
            this.formTwo.firstGateway = true
            this.showAssign = false
            this.error = ''
            return
          }
          this.formTwo.firstGateway = false
          this.isGateway = false
          if (res.result.users && res.result.users.length > 0) {
            this.error = ''
            this.assigneeList = res.result.users
            // 默认勾选
            // let ids = [];
            // res.result.users.forEach(e => {
            //   ids.push(e.username);
            // });
            //this.form.assignees = ids;
            this.formTwo.assignees = []
            this.showAssign = true
          } else {
            this.formTwo.assignees = []
            this.showAssign = true
            this.error = '审批节点未分配候选审批人员，请联系管理员！'
          }
          if (this.error) {
            this.$message.error(this.error)
            return
          }
          this.modalVisible = true
        } else {
          this.$message.error(res.message)
        }
      })
    },
    cancelTijiao() {
      var id = this.formTwo.id
      postAction('/bj/bjIdcardfk/deleteActBussinessById', { actBussinessid: id }).then((res) => {
        if (res.success) {
          this.modalVisible = false
        } else {
          this.$message.error('失败')
        }
      })
    },
    ok() {
      this.form.type = this.types
      postAction('/bj/bjIdcardfk/addBiandong', this.form).then((res) => {
        console.log('岗位变动:' + JSON.stringify(res))
        if (res.success) {
          this.$message.success('保存成功')
          this.form.biandongid = res.message
          this.rows[0].biandongid = res.message
        }
      })
      //this.$emit('ok',this.form)
    },
    cancel() {
      this.$emit('RZC', '')
      this.$emit('close')
    },
  },
}
</script>

<style>
.table-box table {
  width: 100%;
}
.table-box tr td {
  border: solid 1px #ccc;
  padding: 10px;
}
.table-box tr th {
  border: solid 1px #ccc;
  padding: 10px;
}
</style>